const HtmlWebpackPlugin = require("html-webpack-plugin");
const { resolve } = require("path");

module.exports={
    entry:'./src/index.js',
    output:{
        filename:'built.js',
        path:resolve(__dirname,'build')
    },
    module:{
        rules:[
            {
                test:/\.css$/,
                use:['style-loader','css-loader']
            },
            //打包其他资源
            {
                //排除指定的静态资源
                exclude:/\.(css|js|html)$/,
                loader:'file-loader'
            },
        ]
    },
    plugins:[
        new HtmlWebpackPlugin({
            template:'./src/index.html'
        })
    ],
    mode:'development',
    //devServer:用来自动化编译(自动打开浏览器，刷新浏览器)
    //特点：只会在内存中编译打包，不会有任何输出
    // 指令: npx webpack-dev-server
    devServer:{
        static : {directory: resolve(__dirname,'build')},
        watchFiles:['./src/index.html'],
        //启动gzip压缩
        compress:true,
        port:3000,
        //自动打开默认浏览器
        open:true
    }
}